import React, {
    Component,
} from 'react'
import {
    StyleSheet,
    View,
    Platform,
    Text,
    Image,
    TouchableOpacity,
    DeviceEventEmitter, NativeModules, Dimensions, AsyncStorage, ImageBackground
    //Toast
} from 'react-native';
import BasePage from './Component/Common/BasePage';
import GateWayCenter from './Control/GateWayCenter'
import PageView from './Component/Common/PageView'
import {Theme, NavigationPage, ListRow, NavigationBar, Label} from 'teaset';

import GeneralMethods from './Component/Common/GeneralMethods'
import CommonStyle from "./Component/CommonStyle";
import SettingsPage from './Control/SettingsPage';
import FeedbackPage from './Control/FeedbackPage';
import HousekeeperPage from './Control/HousekeeperPage';
import ShareManagerPage from './Control/ShareManagerPage';
import AboutPage from './Control/AboutPage';
import MytwoPage from './MytwoPage'
import GetData from "./GetData";
import LoginPage from './LoginPage'



export default class MyPage extends BasePage {

    _onPress: (buttonIndex: number) => void;

    constructor(props) {
        super(props);
        this.state = {
            ...this.state,
            selectable: true,
            headurl: require('./images/head.png'),
            title: '',
            name: '智宝'
        };

    }


    componentWillMount() {
        AsyncStorage.getItem('person', (error, result) => {
            if (error) {
                // alert('读取失败')
            } else {
                console.log(result)
                let jsonValue = JSON.parse(result);
                var namestring = jsonValue.name;

                this.setState({

                    headurl: jsonValue.headurl != '' ? {uri: jsonValue.headurl} : require('./images/head.png'),

                    name: jsonValue.name != '' ? jsonValue.name : '智宝'
                });


            }
        })

        DeviceEventEmitter.addListener('my', (dic) => {


            AsyncStorage.getItem('person', (error, result) => {
                if (error) {
                    // alert('读取失败')
                } else {
                    console.log(result)
                    let jsonValue = JSON.parse(result);
                    var namestring = jsonValue.name;

                    this.setState({

                        headurl: jsonValue.headurl != '' ? {uri: jsonValue.headurl} : require('./images/head.png'),
                        name: jsonValue.name != '' ? jsonValue.name : '智宝'
                    });


                }
            })

        })

    }

    _onPress(buttonIndex) {
        switch (buttonIndex) {
            case 0:
                this.setState({
                    selectable: true
                });
                break;
            case 1:
                this.setState({
                    selectable: false
                });

                break;
            default:
                this.setState({
                    selectable: true
                });
                break;
        }
    }

    getFavoriteKeys() {//获取收藏的Respository对应的key
        return new Promise((resolve, reject) => {
            AsyncStorage.getItem('name', (error, result) => {
                if (!error) {
                    try {
                        resolve(JSON.parse(result));
                    } catch (e) {
                        reject(error);
                    }
                } else {
                    reject(error);
                }
            });
        });
    }


    render() {
        return (
            <PageView style={{flex: 1}} hiddenNav={true} fromPage={this} {...this.state}>
                <ImageBackground style={{flex: 1}}
                                 source={require('./images/hbg.jpg')}>
                    <View style={{
                        flexDirection: 'column',
                        flex: 1
                    }}>
                        <View style={{height: 10,}}/>


                        <TouchableOpacity style={{}}
                                          onPress={() => {


                                              AsyncStorage.getItem('person', function (error, result) {
                                                  if (error) {
                                                      // alert('读取失败')
                                                  } else {
                                                      console.log(result)
                                                      let jsonValue = JSON.parse(result);
                                                      var name = jsonValue.name;

                                                  }
                                              })

                                              this.navigator.push({view: <MytwoPage/>})
                                          }}
                        >

                            <View style={{
                                alignItems: 'center',
                                justifyContent: 'center',
                                marginTop: 30, marginBottom: 30
                            }}>
                                <View
                                    roundAsCircle={true}
                                    style={{
                                        height: 90,
                                        width: 90,

                                        backgroundColor: '#f2f2f2',
                                        justifyContent: 'center',
                                        borderRadius: 45,

                                    }}>
                                    <Image
                                        resizeMode={'stretch'} style={{
                                        width: 90, height: 90,
                                        borderRadius: 45,

                                    }}
                                        source={this.state.headurl}/>


                                </View>
                            </View>

                        </TouchableOpacity>
                        <View style={{
                            alignItems: 'center',
                            justifyContent: 'center',
                            marginBottom: 40

                        }}>

                            <Text style={{
                                color: 'white'
                            }}>{
                                this.state.name
                            }
                            </Text>
                        </View>


                        <View style={{height: 1, backgroundColor: '#333333'}}/>

                        <View style={{
                            flexDirection: 'row',
                            width: screenW,
                            marginTop: 40,
                            justifyContent: 'space-around',
                            alignItems: 'center',
                        }}>
                            <TouchableOpacity
                                onPress={() => {
                                    this.navigator.push({view: <HousekeeperPage/>})


                                }}
                            >
                                <View style={{
                                    alignItems: 'center',
                                    flexDirection: 'column'
                                }}>

                                    <View style={{
                                        height: 70,
                                        width: 70,
                                        borderRadius: 5,
                                        borderWidth: 1,
                                        borderColor: '#0ECDAC',
                                        alignItems: 'center',
                                        justifyContent: 'center'
                                    }}>
                                        <Image source={require('./images/guanjia.png')}
                                               style={{height: 40, width: 40,}}/>
                                    </View>
                                    <Text style={
                                        {
                                            marginTop: 10,
                                            color: '#ffffff',
                                        }
                                    }> 管家助手</Text>

                                </View>
                            </TouchableOpacity>

                            <TouchableOpacity
                                onPress={() => {
                                    this.navigator.push({view: <GateWayCenter/>})
                                }}
                            >
                                <View style={{
                                    alignItems: 'center',
                                    flexDirection: 'column'
                                }}>

                                    <View style={{
                                        height: 70,
                                        width: 70,
                                        borderRadius: 5,
                                        borderWidth: 1,
                                        borderColor: '#0ECDAC',
                                        alignItems: 'center',
                                        justifyContent: 'center'
                                    }}>
                                        <Image source={require('./images/wangguan.png')}
                                               style={{height: 30, width: 30,}}/>
                                    </View>
                                    <Text style={
                                        {
                                            marginTop: 10,
                                            color: '#ffffff',
                                        }
                                    }>（SN）网关管理</Text>

                                </View>
                            </TouchableOpacity>

                            <TouchableOpacity
                                onPress={() => {
                                    this.navigator.push({view: <ShareManagerPage/>})

                                }}
                            >
                                <View style={{
                                    alignItems: 'center',
                                    flexDirection: 'column'
                                }}>

                                    <View style={{
                                        height: 70,
                                        width: 70,
                                        borderRadius: 5,
                                        borderWidth: 1,
                                        borderColor: '#0ECDAC',
                                        alignItems: 'center',
                                        justifyContent: 'center'
                                    }}>
                                        <Image source={require('./images/fenxiaong.png')}
                                               style={{height: 40, width: 40,}}/>
                                    </View>
                                    <Text style={
                                        {
                                            marginTop: 10,
                                            color: '#ffffff',
                                        }
                                    }>分享管理</Text>

                                </View>
                            </TouchableOpacity>


                            <TouchableOpacity
                                onPress={() => {
                                    this.navigator.push({view: <FeedbackPage/>})

                                }}
                            >
                                <View style={{
                                    alignItems: 'center',
                                    flexDirection: 'column'
                                }}>


                                    <View style={{
                                        height: 70,
                                        width: 70,
                                        borderRadius: 5,
                                        borderWidth: 1,
                                        borderColor: '#0ECDAC',
                                        alignItems: 'center',
                                        justifyContent: 'center'
                                    }}>
                                        <Image source={require('./images/yijian.png')}
                                               style={{height: 40, width: 40,}}/>
                                    </View>
                                    <Text style={
                                        {
                                            marginTop: 10,
                                            color: '#ffffff',
                                        }
                                    }>意见反馈</Text>

                                </View>
                            </TouchableOpacity>

                        </View>
                        <View style={{
                            flexDirection: 'row',
                            width: screenW,
                            marginTop: 30,
                            justifyContent: 'space-around',
                            alignItems: 'center',
                        }}>
                            <TouchableOpacity
                                onPress={() => {
                                    this.navigator.push({view: <SettingsPage/>})


                                }}
                            >
                                <View style={{
                                    alignItems: 'center',
                                    flexDirection: 'column'
                                }}>


                                    <View style={{
                                        height: 70,
                                        width: 70,
                                        borderRadius: 5,
                                        borderWidth: 1,
                                        borderColor: '#0ECDAC',
                                        alignItems: 'center',
                                        justifyContent: 'center'
                                    }}>
                                        <Image source={require('./images/setting.png')}
                                               style={{height: 30, width: 30,}}/>
                                    </View>
                                    <Text style={
                                        {
                                            marginTop: 10,
                                            color: '#ffffff',
                                        }
                                    }> 设置</Text>

                                </View>
                            </TouchableOpacity>

                            <TouchableOpacity
                                onPress={() => {
                                    this.navigator.push({view: <AboutPage/>})
                                }}
                            >
                                <View style={{
                                    alignItems: 'center',
                                    flexDirection: 'column'
                                }}>
                                    <View style={{
                                        height: 70,
                                        width: 70,
                                        borderRadius: 5,
                                        borderWidth: 1,
                                        borderColor: '#0ECDAC',
                                        alignItems: 'center',
                                        justifyContent: 'center'
                                    }}>
                                        <Image source={require('./images/guanyu.png')}
                                               style={{height: 30, width: 30,}}/>
                                    </View>
                                    <Text style={
                                        {
                                            marginTop: 10,
                                            color: '#ffffff',
                                        }
                                    }>关于易盈</Text>

                                </View>
                            </TouchableOpacity>

                            <TouchableOpacity
                                onPress={() => {

                                }}
                            >
                                <View style={{
                                    alignItems: 'center',
                                    flexDirection: 'column'
                                }}>
                                    <View style={{
                                        height: 70,
                                        width: 70,
                                        justifyContent: 'center'
                                    }}>
                                        <Image
                                            style={{height: 30, width: 30,}}/>
                                    </View>
                                    <Text style={
                                        {
                                            marginTop: 10,
                                            color: '#ffffff',
                                        }
                                    }></Text>

                                </View>
                            </TouchableOpacity>

                            <TouchableOpacity
                                onPress={() => {

                                }}
                            >
                                <View style={{
                                    alignItems: 'center',
                                    flexDirection: 'column'
                                }}>
                                    <View style={{
                                        height: 70,
                                        width: 70,

                                        alignItems: 'center',
                                        justifyContent: 'center'
                                    }}>
                                        <Image
                                            style={{height: 30, width: 30,}}/>
                                    </View>
                                    <Text style={
                                        {
                                            marginTop: 10,
                                            color: '#ffffff',
                                        }
                                    }></Text>

                                </View>
                            </TouchableOpacity>

                        </View>
                        <View style={{

                            flex: 1
                        }}>
                            <Text style={{
                                fontSize: 11,
                                color: '#f2f2f2',
                                position: 'absolute', right: 40,
                                bottom: 30,
                            }}>-- 易盈出品 --
                            </Text>
                        </View>
                    </View>
                </ImageBackground>
            </PageView>
        );

    }

    componentDidMount() {
        this.setState({
            refreshing: true,
        })
        setTimeout(() => {
            this.setState({
                refreshing: false,
            })
        }, 3000)
    }


}
let screenW = Dimensions.get('window').width;
let screenH = Dimensions.get('window').height;
// iPhoneX
const X_WIDTH = 375
const X_HEIGHT = 812
const styles = StyleSheet.create({
    container: {
        flex: 1,
        marginBottom: Platform.OS === 'ios' &&
        ((screenH === X_HEIGHT && screenW === X_WIDTH) ||
            (screenH === X_WIDTH && screenW === X_HEIGHT)) ? 34 : null
    },
    title: {
        flexDirection: 'row',
        width: CommonStyle.screenwidth
    },
    title_left: {
        marginLeft: 15,
        alignSelf: 'center'
    },

    title_right: {
        fontSize: 14,
        color: CommonStyle.color_deep_red,
        marginRight: 15,
        alignSelf: 'center'
    },
    button: {
        height: 29,
        width: CommonStyle.screenwidth / 5,
        flexDirection: 'row', justifyContent: 'flex-end',
        borderBottomLeftRadius: 5,
        borderTopLeftRadius: 5,
    },
    button2: {
        height: 29,
        width: CommonStyle.screenwidth / 5,
        flexDirection: 'row',
        borderTopRightRadius: 5,
        borderBottomRightRadius: 5,
    },

    tab1Style: {

        alignItems: 'center',
        justifyContent: 'center',
        backgroundColor: 'white',

    },
    tab2Style: {
        alignItems: 'center',
        justifyContent: 'center',
        backgroundColor: '#1196DB',

    },
    tab3Style: {
        alignItems: 'center',
        justifyContent: 'center',
        backgroundColor: '#1196DB',
    },
    tab4Style: {
        alignItems: 'center',
        justifyContent: 'center',
        backgroundColor: 'white',
    },
    newText1Style: {
        fontSize: 11,
        color: '#1196DB'
    },
    newText2Style: {
        fontSize: 11,
        color: 'white'
    },
});
